<template>
<view>
<view class="container">
    <view class="swiper">
        <swiper autoplay="true" duration="1200" indicatorDots="true" interval="3000">
            <swiper-item v-for="(item, index) in slide" :key="index">
                <image class="nav-icon" mode="aspectFill" :src="item.thumb"></image>
            </swiper-item>
        </swiper>
    </view>
    <view class="nav">
        <navigator v-for="(item, index) in navs" :key="index" :class="'nav-item ' + ((index+1)%3==0?'nav-item-no-border':'')" hoverClass="navigator-hover" :url="item.url">
            <image class="nav-icon" :src="item.icon"></image>
            <view class="nav-title">{{item.name}}</view>
        </navigator>
    </view>
    <view class="commend">
        <block v-for="(item, index) in commend" :key="index">
            <view class="commend-header-title">{{item.name}}</view>
            <view class="commend-column">
                <navigator v-for="(subItem, index2) in item.article" :key="index2" class="commend-item" hoverClass="navigator-hover">
                    <image class="commend-thumb" :src="subItem.thumb"></image>
                    <view class="commend-title">{{subItem.title}}</view>
                </navigator>
            </view>
        </block>
    </view>
</view>
<!--<import src="/we7/pages/templates/footer.wxml"></import>-->
<block data-type="template" data-is="footerWx" data-attr="...tabBar">
    <view class="we7-bottom" :style="'background-color:' + backgroundColor + 'border-color:' + borderStyle" v-if="list">
        <block v-for="(item, index) in list" :key="index">
            <view class="we7-bottom-item" hoverClass="active" v-if="item.pageUrl=='/'+thisurl">
                <navigator hoverClass="active" open-type="redirect" :url="item.pagePath">
                    <image class="item-img" mode="widthFix" :src="item.selectedIconPath"></image>
                    <view class="item-text" :style="'color: ' + selectedColor + ''">{{item.text}}</view>
                </navigator>
            </view>
            <view class="we7-bottom-item" hoverClass="active" v-else>
                <navigator hoverClass="active" open-type="redirect" :url="item.pagePath">
                    <image class="item-img" mode="widthFix" :src="item.iconPath"></image>
                    <view class="item-text" :style="'color: ' + color">{{item.text}}</view>
                </navigator>
            </view>
        </block>
    </view>
    <view class="we7-bottom-placeholder"></view>
</block>
</view>
</template>

<script>
var app = getApp();

export default {
  data() {
    return {
      navs: [],
      slide: [],
      commend: [],
      userInfo: {}
    };
  },

  components: {},
  props: {},
  onLoad: function () {
    var a = this;
    app.globalData.util.footer(a), app.globalData.util.request({
      url: "wxapp/home/nav",
      cachetime: "30",
      success: function (e) {
        e.data.message.errno || (console.log(e.data.message.message), a.setData({
          navs: e.data.message.message
        }));
      }
    }), app.globalData.util.request({
      url: "wxapp/home/slide",
      cachetime: "30",
      success: function (e) {
        e.data.message.errno || a.setData({
          slide: e.data.message.message
        });
      }
    }), app.globalData.util.request({
      url: "wxapp/home/commend",
      cachetime: "30",
      success: function (e) {
        e.data.message.errno || a.setData({
          commend: e.data.message.message
        });
      }
    });
  },
  methods: {}
};
</script>
<style>
@import "./index.css";
</style>